<!--
 * @Author: zeng_ze
 * @LastEditors: zhong_m
 * @date: 2019-11-07
 * @Description: 资源管理
 -->
<template>
  <!-- <router-view class="main-wrapper" /> -->
  <div>
    <fks-query-page
      ref="table"
      v-loading="loading"
      :data="tableData"
      height="100%"
      :current-page.sync="currentPage"
      :page-sizes="[15, 20, 50, 100]"
      :page-size.sync="pageSize"
      layout="total, sizes, prev, pager, next, jumper"
      :total="total"
      :table-name="LANG.STM_RESOURCE"
      @query="getDataScopeTreeList"
    >
      <template slot="singleSearch">
        <div class="single-searchBox">
          <fks-button type="primary" icon="fks-icon-plus" @click="handleAdd">
            {{ LANG.ADD }}
          </fks-button>
        </div>
      </template>
      <template>
        <fks-table-column
          type="index"
          label="#"
          align="center"
          min-width="50px"
        />
        <fks-table-column
          prop="treeName"
          :label="LANG.NAME"
          sortable="custom"
          header-align="center"
          align="left"
        />
        <fks-table-column
          prop="treeUrl"
          :label="LANG.INTERFACE"
          header-align="center"
          align="left"
        />

        <fks-table-column :label="LANG.OPERATION" width="100" align="left">
          <template slot-scope="scope">
            <fks-button type="text" @click="handleEdit(scope.row)">
              {{ LANG.EDIT }}
            </fks-button>
            <fks-button danger-text @click.native="handleDelete(scope.row.id)">
              {{ LANG.DELETE }}
            </fks-button>
          </template>
        </fks-table-column>
      </template>
    </fks-query-page>
    <resource-detail v-if="visible" :tree-data="node" />
  </div>
</template>
 
 <script>
import { getDataScopeTreeList, deleteDataScopeTree } from './api'
import { getUserInfo } from '@/api/user'
import ResourceDetail from './ResourceDetail'
import Mix from '@/mixins/module'
export default {
  name: 'Resource',
  mixins: [Mix],
  components: {
    ResourceDetail
  },
  data() {
    return {
      loading: true,
      currentPage: 1,
      pageSize: 15,
      total: 0,
      tableData: [],
      visible: false,
      node: {}
    }
  },
  computed: {
    multiPortal() {
      return this.$store.getters.multiPortal
    },
    portal() {
      return this.$store.state.portal
    }
  },
  mounted() {
    this.getDataScopeTreeList()
  },
  methods: {
    clear() {},
    @permission('resource:query')
    getDataScopeTreeList() {
      let params = {
        pageNo: this.currentPage,
        pageSize: this.pageSize,
        type: this.multiPortal ? this.portal.type : null
      }
      getDataScopeTreeList(params).then((res) => {
        if (res.status) {
          this.loading = false
          this.tableData = res.data.list
          this.total = res.data.total
        }
      })
    },
    handleAdd() {
      this.node.operateType = 'add'
      this.visible = true
    },
    handleEdit(row) {
      this.node = row
      this.node.operateType = 'edit'
      this.visible = true
    },
    handleDelete(id) {
      this.$confirm(this.LANG.DELETE_CONFIRM, this.LANG.TIPS, {
        confirmButtonText: this.LANG.DELETE,
        cancelButtonText: this.LANG.CANCEL,
        confirmButtonClass: 'fks-button--danger',
        type: 'warning'
      })
        .then(() => {
          deleteDataScopeTree({ id: id }).then((res) => {
            if (res.status) {
              this.$message.success(this.LANG.DELETE_SUCCESS)
              this.getDataScopeTreeList()
            }
          })
        })
        .catch(() => {})
    }
  }
}
</script>
 
 <style lang="scss">
</style>